iT邦幫忙

DAY 6
2

Chrome Extension 開發筆記系列 第 6 篇

Chrome Extension 筆記(06)可同步的離線儲存

  • 分享至 

  • xImage
  •  

除了 HTML5 所提供的各種 Storage 方案外,
Chrome API 也提供了實做了類似的功能,
不過更棒的是還能選擇讓儲存的資料像書籤一樣隨著帳號同步.
總覺得直接看程式碼會比較快XD

manifest.json

{
   "manifest_version": 2,
   "name": "ironman6",
   "version": "1.0",
   "browser_action": {
      "default_popup": "index.html"
   },
	"permissions": [
		"storage"
	]
}

index.html

		<title>ironman6</title>
		<style>body {width: 500px ;}</style>
	
	
		<textarea id="content" cols="40" rows="20"></textarea>
		<button id="save">Save</button>
		<script src="app.js"></script>
	

app.js

document.addEventListener('DOMContentLoaded', function () {
	document.querySelector('#save').addEventListener('click', setStorage);
	getStorage();
});


var storage = chrome.storage.sync;
var content = document.querySelector('#content');

function setStorage() {
	var value = content.value;
	storage.set({'value': value}, function() {

	});
}

function getStorage() {
	storage.get('value', function(items) {
		if (items.value) {
			content.value = items.value;
		}
	});
}

Chrome storage 提供的同步功能很方便,
但並不是無上限, 而是有 800 kb (102,400 bytes)的限制,
而每個區塊(以上面的例子來說就是指 value)的上限為 32 kb (4,096 bytes),
因此正常使用下這空間應該是非常足夠的.


上一篇
Chrome Extension 筆記(05)取得所有分頁(TAB)訊息
下一篇
Chrome Extension 筆記(07)針對 cookie 進行讀寫
系列文
Chrome Extension 開發筆記 共 27 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

我要留言

立即登入留言